<template>
  <view
    class="layout-empty"
    :style="{height: windowHeight, width: windowWidth}"
  >
    <view class="layout-empty__wrapper" :style="{paddingTop: top + 'px'}">
      <slot></slot>
    </view>
<!--    <d-loading v-show="isLoading" />-->
  </view>
</template>

<script lang="ts" setup>
import {usePmProjectStore} from "@/stores/pm/project";

defineOptions({ name: 'LayoutEmpty' })

// 获取屏幕边界到安全区域距离
let safeAreaInsets
let systemInfo
let top = 0

// #ifdef MP-WEIXIN
// 微信小程序使用新的API
systemInfo = uni.getWindowInfo()
safeAreaInsets = systemInfo.safeArea
  ? {
    top: systemInfo.safeArea.top,
    right: systemInfo.windowWidth - systemInfo.safeArea.right,
    bottom: systemInfo.windowHeight - systemInfo.safeArea.bottom,
    left: systemInfo.safeArea.left,
  }
  : null
top = safeAreaInsets?.top || 0
// #endif

// #ifndef MP-WEIXIN
// 其他平台继续使用uni API
systemInfo = uni.getSystemInfoSync()
safeAreaInsets = systemInfo.safeAreaInsets
// #endif

const windowHeight = (uni.getWindowInfo().windowHeight - top) + 'px'
const windowWidth = uni.getWindowInfo().windowWidth + 'px'

onLoad((query) => {
  const projectNumber = query['project_number']
  if (projectNumber) {
    usePmProjectStore().setProjectNumber(projectNumber);
  }
})
</script>

<style lang="scss" scoped>
.layout-empty {
  position: relative;

  &__wrapper {
    position: relative;
    width: 100%;
    height: 100%;
  }
}
</style>
